@charset "utf-8";
@import "../../../assets/scss/base/necessary.scss";
@import "./collect.scss";
$color_e1e9f0:#e1e9f0;
.my{
  a{
    color:$color_424242;
  }
  .summary{
    .info{
      padding:px2rem(20) px2rem(24) px2rem(20) 0;
      div:last-child{
        @extend .relative;
        h1{
          @include px2px(font-size,34);
          color:$color_424242;
          max-width:px2rem(480);
          @include clamp(1);
        }
        p{
          @include px2px(font-size,24);
          color:$color_9E9E9E;
          @include clamp(1);
          &.noLogin{
            @include px2px(font-size,34);
            color:$color_424242;
          }
        }
      }
    }
    .bottom{
      border-top:solid 1px $color_e1e9f0;
      a{
        padding:px2rem(20) 0;
        display: block;
        @include px2px(font-size,30);
        text-align: center;
        border-right:solid 1px $color_e1e9f0;
        line-height: px2rem(36);
        strong{
          margin-left:px2rem(16);
          color:$color_55C1DD;
        }
        &[data-count]{
          &:after{
            content: attr(data-count);
            display: inline-block;
            vertical-align: top;
            margin-left:px2rem(16);
            color:$color_55C1DD;
            @include px2px(font-size,32);
          }
        }
      }
    }
    .photo{
      width:px2rem(115);
      height:px2rem(115);
      margin:0 px2rem(35) 0 px2rem(40);
      img{
        border-radius:50%;
        width:100%;
        height:100%;
      }
    }
  }
  .order{
    li{
      @extend .relative;
      &:after{
        content: '';
        display: inline-block;
        position: absolute;
        right: 0;
        top:50%;
        background:#e1e9f0;
        width: 1px;
        height: px2rem(60);
        margin-top: px2rem(-30);
        display: inline-block;
      }
      &:last-child{
        &:after{
          display: none;
        }
      }
    }
    a{
      padding:px2rem(24);
      @extend .text_center;
      &[data-count]:after{
      }
      em{
        @extend .relative;
        width:px2rem(42);
        height: px2rem(42);
        display: block;
        width:px2rem(42);
        height: px2rem(42);
        background: url(../pages/my/images/all.png) no-repeat top center;
        @extend .contain;
        margin: 0 auto px2rem(10) auto;
        &[data-count]:after{
          content: attr(data-count);
          position: absolute;
          right:px2rem(-32);
          top:px2rem(-10);
          font-size:px2rem(18);
          width: px2rem(36);
          height: px2rem(24);
          line-height:px2rem(24);
          text-align: center;
          border-radius:px2rem(20);
          color: #fff;
          background:$color_FC5D7B;
          border:solid 1px #ff3b30;
          white-space: pre;
        }
        &[data-count='0']:after{
          display:none;
        }
      }
      &.paying{
        em{
          background: url(../pages/my/images/paying.png) no-repeat top center;
          @include bg_size_rem(40);
        }
      }
      &.comment{
        em{
          background: url(../pages/my/images/comment.png) no-repeat top center;
          @include bg_size_rem(40);
        }
      }
      &:after{
        content: attr(data-font);
        color:$color_424242;
        @extend .text_center;
        @include px2px(font-size,24);
        display: block;
      }
    }
  }
  .item{
    li{
      h1{
        border-bottom: solid 1px $color_e1e9f0;
        padding: px2rem(35) 0;
        .tb_icon{
          @extend .relative;
          &[data-count]:after{
            content: '';
            position: absolute;
            right:px2rem(-30);
            top:50%;
            width:px2rem(14);
            height: px2rem(14);
            margin-top:px2rem(-7);
            border-radius:50%;
            color: #ffffff;
            background:$color_FC5D7B;
          }
          &[data-count='0']:after{
            display:none;
          }
        }
      }
      &:last-child{
        h1{
          border-bottom: none;
        }
      }
    }
    a{
      @extend .relative;
      padding:0 px2rem(24);
      color:$color_424242;
      @include px2px(font-size,28);
      &:after{
        right: px2rem(24);
      }
      &.traveller{
        &:before{
          background:url(../pages/my/images/traveller.png) no-repeat;
          background-size:contain;
        }
      }
      &.hotel{
        &:before{
          background:url(../pages/my/images/hotel.png) no-repeat;
          background-size:contain;
        }
      }
      &.collect{
        &:before{
          background:url(../pages/my/images/collect.png) no-repeat;
          background-size:contain;
        }
      }
      &.service{
        &:before{
          background:url(../pages/my/images/service.png) no-repeat;
          background-size:contain;
        }
      }
      &:before{
        content: '';
        display:inline-block;
        width:px2rem(34);
        height:px2rem(34);
        margin-right:px2rem(24);
        background:url(../pages/my/images/taobao.png) no-repeat;
        background-size:contain;
        vertical-align: top;
      }
    }
  }
}
// 个人中心 设置
.setting{
  .item{
    a:before{
      display: none important();
    }
  }
}
